<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>购物车的实现</title>
	<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="css/animate.css" />
	<link rel="stylesheet" href="https://www.jq22.com/jquery/bootstrap-4.2.1.css">
	<link rel="stylesheet" type="text/css" href="css/fonts.css" />
	<link rel="stylesheet" type="text/css" href="css/flaticon.css" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
	<link rel="stylesheet" type="text/css" href="css/fullpage.min.css" />
	<link rel="stylesheet" type="text/css" href="css/demo.css" />
	<link rel="stylesheet" type="text/css" href="css/owl.carousel.css" />
	<link rel="stylesheet" type="text/css" href="css/owl.theme.default.css" />
	<link rel="stylesheet" type="text/css" href="css/magnific-popup.css" />
	<link rel="stylesheet" type="text/css" href="css/style.css" />
	<link rel="stylesheet" type="text/css" href="css/responsive.css" />
	<script src="./js/index.js" type="text/javascript" charset="utf-8"></script>
	<script src="./js/angular.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body ng-app>
<div class="ck_navigation_main_wrapper ck_navigation_inner_main_wrapper float_left">
		<div class="container-fluid">
			<div class="ck_logo_wrapper ck_logo_wrapper_inner">
				<a href="#">
					<img src="images/logo.png" alt="logo">
				</a>
			</div>
			<div class="ck_navigation_right_wrapper">
				<div class="main main--demo-3">
					<div class="content content--demo-3">
						<div class="hamburger hamburger--demo-3 js-hover hamburger_inner">
							<div class="hamburger__line hamburger__line--01">
								<div class="hamburger__line-in hamburger__line-in--01"></div>
							</div>
							<div class="hamburger__line hamburger__line--02">
								<div class="hamburger__line-in hamburger__line-in--02"></div>
							</div>
							<div class="hamburger__line hamburger__line--03">
								<div class="hamburger__line-in hamburger__line-in--03"></div>
							</div>
							<div class="hamburger__line hamburger__line--cross01">
								<div class="hamburger__line-in hamburger__line-in--cross01"></div>
							</div>
							<div class="hamburger__line hamburger__line--cross02">
								<div class="hamburger__line-in hamburger__line-in--cross02"></div>
							</div>
						</div>
						<div class="global-menu">
							<div class="global-menu__wrap" id='cssmenu'>
								<ul>
									<li class="has-sub"><a class="global-menu__item global-menu__item--demo-3" href="#">主页</a>
										<ul>
											<li><a href="index_II.html" class="global-menu__item global-menu__item--demo-3">主页详细</a>
											</li>
										</ul>
									</li>
									
									<li class="has-sub"><a class="global-menu__item global-menu__item--demo-3" href="#">产品</a>
										<ul>
											<li><a href="product_sidebar.html" class="global-menu__item global-menu__item--demo-3">产品详情</a>
											</li>
										</ul>
									</li>
									<li><a class="global-menu__item global-menu__item--demo-3" href="gallery.html">产品展示</a>
									</li>
									<li class="has-sub"><a class="global-menu__item global-menu__item--demo-3" href="#">分页</a>
										<ul>
											<li><a href="cart.html" class="global-menu__item global-menu__item--demo-3">购物车</a>
											</li>
										</ul>
									</li>
									<li class="has-sub"><a class="global-menu__item global-menu__item--demo-3" href="#">博客</a>
										<ul>
											<li><a href="blog_single_right.html" class="global-menu__item global-menu__item--demo-3">博客详情</a>
											</li>
										</ul>
									</li>
									
								</ul>
							</div>
						</div>
						<svg class="shape-overlays" viewBox="0 0 100 100" preserveAspectRatio="none">
							<path class="shape-overlays__path" d="M 0 100 C 50 100 50 100 100 100 V 100 H 0"></path>
							<path class="shape-overlays__path" d="M 0 100 C 50 100 50 100 100 100 V 100 H 0"></path>
							<path class="shape-overlays__path" d="M 0 100 C 50 100 50 100 100 100 V 100 H 0"></path>
						</svg>
					</div>
				</div>
				<div class="ck_login_btn">	
				</div>
				<div class="buss_cart_section_wrapper">
					<div class="buzz_cart">
						<ul>
							<li class="buzz_cart_dropdown">
								<ul>
									<li>
									</li>
								</ul>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="ck_title_main_wrapper float_left">
		<div class="container">
			<div class="row">
				<div class="col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
					<div class="ck_title_cont float_left">
						<p>购物车</p>
					</div>
				</div>
				<div class="col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
					<div class="ck_title_cont float_left">
						<ul>
							<li><a href="index_II.html">主页 &nbsp; ></a>
							</li>
							<li>购物车</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div style="margin-left:auto; margin-right:auto; width:1100px; padding-top:30px">
    	<input  type="text" name="" value=""  ng-model="abc" placeholder="输入关键字快速查找">{{abc}}
			<img src="img/fd.png" alt="logo">
    </div>
	<div ng-controller="cartController" class="container">
		<table class="table" ng-show="cart.length">
			<thead>
				<tr>
					<th>产品编号</th>
					<th>产品名字</th>
					<th>购买数量</th>
					<th>产品单价</th>
					<th>产品总价</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<tr ng-repeat="item in cart| filter:abc">
					<td ng-bind="item.id"></td>
					<td ng-bind="item.name"></td>
					<td>
						<button type="button" ng-click="reduce(item.id)" class="btn btn-primary btn-sm">-</button>
						<input type="text" ng-model="item.quantity" style="text-align: center;">
						<button type="button" ng-click="add(item.id)" class="btn btn-primary btn-sm">+</button>
					</td>
					<td ng-bind="item.price"></td>
					<td ng-bind="item.price*item.quantity"></td>
					<td><button type="button" ng-click="remove(item.id)" class="btn btn-danger btn-sm">移除</button></td>
				</tr>
				<tr>
					<td>总购物价</td>
					<td ng-bind="totalPrice()"></td>
					<td>总购买数量</td>
					<td ng-bind="totalQuantity()"></td>
					<td colspan="2">
						<button type="button"  ng-click="checkout(item.id)" class="btn btn-danger btn-sm">结算</button>
						<hr/>
						<button type="button"  ng-click="cart = {}" class="btn btn-danger btn-sm">清空购物车</button></td>
				</tr>
			</tbody>				
		</table>
		<p ng-show="!cart.length">您的购物车已空</p>
	</div>
	<!-- partner wrapper End-->
	<div class="section2_bottom_wrapper float_left" >
		<div class="container">
			<div class="row">
				<div class="col-lg-12 col-md-12 col-xs-12 col-sm-12">
					<div class="btm_foter_box" >
						<p >著作权 © 2019 <a href="#"> Cool Town</a> Template by <a href="#"> Webstrot</a>
						</p>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/modernizr.js"></script>
	<script src="js/fullpage.min.js"></script>
	<script src="js/scrolloverflow.js"></script>
	<script src="js/demo3.js"></script>
	<script src="js/easings.js"></script>
	<script src="js/jquery.inview.min.js"></script>
	<script src="js/owl.carousel.js"></script>
	<script src="js/jquery.magnific-popup.js"></script>
	<script src="js/custom_II.js"></script>
</body>
</html>